<template>
	<view>
		<u-navbar title=" " :autoBack="true" :leftIcon="type?'arrow-left':' '" bgColor="#665CFD" leftIconColor='#fff'
			placeholder></u-navbar>
		<view class="" v-if='!loading'>
			<view class="head">
				<image src="/static/title.png" class="head__title" mode=""></image>
				<view class="head__tip">
					请选择你当前就读的学校
				</view>
				<view class="head__check" @click="show=true">
					<image src="/static/checkbox.png" class="head__check__bg" mode=""></image>
					<view class="head__check__con" v-if="!school_id">
						<image src="/static/zhi.png" class="head__check__con__icon" mode=""></image>
						<view class="head__check__con__text">
							请选择
						</view>
						<u-icon name="arrow-down"></u-icon>
					</view>
					<view class="head__check__con" v-else>
						<view class="head__check__con__text u-line-1" style="width: 290rpx;">
							{{school}}
						</view>
						<u-icon name="arrow-down"></u-icon>
					</view>
				</view>
			</view>
			<image :src="URL('/uploads/bg.png')" mode="widthFix" style="width: 750rpx;"></image>

		</view>
		<u-loading-page :loading="loading"></u-loading-page>
		<u-popup mode="bottom" round="20rpx" :show="show" @close="show=false">
			<view class="popbox">
				<view class="popbox__title u-flex-between">
					<view class="u-flex u-flex-y-center popbox__title__left" @click="show1=true"
						style="position: relative;z-index: 1;">
						<image src="/static/home/sz.png" class="popbox__title__icon" mode=""></image>
						开通学校
					</view>
					<view class="popbox__title__text">
						选择学校
					</view>
					<view class="popbox__title__qx" @click="show=false">
						取消
					</view>
				</view>
				<!-- 搜索 -->
				<u-search @change='getschool' placeholder="搜索学校名称" :showAction='false' borderColor='#6B85D0'
					bgColor='#fff' height="70rpx" v-model="keyword"></u-search>
				<view class="popbox__tip">
					猜你想搜
				</view>
				<scroll-view scroll-y="true" class="scbox">
					<view class="scbox__list">
						<view class="scbox__item" :class="item.ischeck?'active':''" @click="clickcheck(item,index)"
							v-for="(item,index) in schoollist" :key="index">
							<view class="scbox__item__dian" :style="{background:item.ischeck?'#fff':'#323232'}">

							</view>
							<view class="scbox__item__name" :style="{color:item.ischeck?'#fff':'#323232'}">
								{{item.name}}
							</view>
							<u-icon v-if="item.ischeck" name="checkmark-circle-fill" color="#fff"></u-icon>
						</view>
					</view>
					<view class="scbox__tips">
						<view class="scbox__item__dian" style="background: #93939B;margin: 0 13rpx;">

						</view>
						仅显示部分学校，更多学校请搜索查找
						<view class="scbox__item__dian" style="background: #93939B;margin: 0 13rpx;">

						</view>
					</view>
				</scroll-view>
			</view>
		</u-popup>
		<!-- 开通 -->
		<u-popup mode="bottom" round="20rpx" :show="show1" @close="show1=false" :zIndex='10078'
			overlayStyle='z-index:10075;'>
			<view class="popbox1">
				<view class="popbox__title u-flex u-flex-start">
					<image src="/static/home/kt.png" class="popbox__kt" mode=""></image>
					<view class="" style="flex: 1;">
						开通新学校
					</view>
					<view class="popbox__title__qx" @click="show1=false">
						关闭
					</view>
				</view>
				<image :src="URL('/uploads/20250317/80cd2769e4ccee668bf5ce970750f1b8.png')"
					style="width: 566.67rpx;margin-bottom: 30rpx;" mode="widthFix"></image>
				<!-- <image src="https://mp-b54a63ff-3ce2-4df8-8d6e-f855d8976d34.cdn.bspapp.com/img/kttext.png" style="width: 681.55rpx;" mode="widthFix"></image> -->
				<view class="" style="color: #333333;font-size: 28rpx;line-height: 50.6rpx;">
					如果你是想暴力变现，那请就此止步</br>
					同学们的喜爱和认可才是我们的动力</br>
					认同我们的观点，才可以成为我们的校园合伙人</br>
					每个校园只招收一个合伙人</br>
					合伙人拥有该校园的经营权和管理权</br>
					除了社区，还有更多校园业务等你来解锁~</br>
					详细请联系微信.<image src="/static/home/sz.png" style="width: 32.14rpx;height:29.17rpx" mode=""></image>JLXYFW000001
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import home from '@/api/_home.js'
	import user from '@/api/_user.js'
	export default {
		data() {
			return {
				school: '',
				onpageshow: true,
				schoollist: [],
				school_id: null,
				loading: true,
				show: false,
				show1: false,
				keyword: '',
				type: ''
			};
		},
		onLoad(o) {
			this.type = o.type
			this.school_id = uni.getStorageSync('xguserinfo').school_id
			this.getschool()
		},
		methods: {
			async getschool() {
				console.log(this.school_id)
				let res = await home.school({
					keyword: this.keyword
				})
				if (res.data.code == 1) {
					this.loading = false
					this.schoollist = res.data.data
					this.schoollist.map(t => {
						t.ischeck = false
						if (this.school_id == t.id) {
							this.school = t.name
							t.ischeck = true
						}
					})
				}
			},
			clickcheck(item, index) {
				this.schoollist.map(t => {
					t.ischeck = false
				})
				item.ischeck = true
				this.bind(item.id, item)
				this.$forceUpdate()
			},
			async bind(id, item) {
				let res = await home.bindSchool({
					id
				})
				if (res.data.code == 1) {
					user.userindex().then(res1 => {
						if (res1.data.code == 1) {
							uni.setStorageSync('xguserinfo', res1.data.data.userinfo)
							uni.setStorageSync('xgschool', item.short_name)
							uni.switchTab({
								url: '/pages/tabbar/home'
							})
						}
					})
				}
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #665CFD;
	}

	.head {
		height: 389rpx;
		display: flex;
		flex-direction: column;
		align-items: center;

		// background-color: #fff;
		&__title {
			width: 599rpx;
			height: 115rpx;
			margin-top: 131rpx;
		}

		&__tip {
			font-family: PingFang SC;
			font-weight: 400;
			font-size: 36rpx;
			color: #F2F1FF;
			line-height: 36rpx;
			margin-top: 25rpx;
		}

		&__check {
			width: 394.05rpx;
			height: 89.29rpx;
			position: relative;
			margin-top: 34rpx;

			&__bg {
				width: 394.05rpx;
				height: 89.29rpx;
				position: absolute;
				top: 0;
				left: 0;
			}

			&__con {
				width: 321rpx;
				padding: 0 25rpx 0 48rpx;
				display: flex;
				align-items: center;
				position: relative;
				height: 89.29rpx;

				&__icon {
					width: 34.52rpx;
					height: 30.36rpx;
				}

				&__text {
					font-family: PingFang SC;
					font-weight: 800;
					font-size: 30rpx;
					color: #332F6C;
					line-height: 30rpx;
					flex: 1;
				}

			}
		}
	}

	.popbox {
		padding: 0 30rpx;
		height: 85vh;

		&__title {
			height: 98rpx;
			display: flex;
			align-items: center;
			// justify-content: space-between;
			font-family: PingFang SC;
			font-weight: 800;
			font-size: 33rpx;
			color: #000000;
			line-height: 33rpx;
			position: relative;

			&__icon {
				width: 30.36rpx;
				height: 30.36rpx;
				margin-right: 6rpx;
			}

			&__left {
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 25rpx;
				color: #1E59F1;
				line-height: 24rpx;
			}

			&__qx {
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 25rpx;
				color: #999999;
				line-height: 24rpx;
			}

			&__text {
				text-align: center;
				position: absolute;
				height: 98rpx;
				line-height: 98rpx;
				top: 0;
				left: 0;
				width: 690rpx;

			}
		}

		&__tip {

			font-family: PingFang SC;
			font-weight: 800;
			font-size: 29rpx;
			color: #000000;
			line-height: 96rpx;
		}

		.scbox {
			height: calc(100% - 300rpx);

			&__list {}

			&__item {
				height: 86rpx;
				background: #F3F4F6;
				border-radius: 6rpx;
				padding: 0 30rpx;
				display: flex;
				align-items: center;
				margin-bottom: 8rpx;

				&__dian {
					width: 6rpx;
					height: 6rpx;
					background: #323232;
					border-radius: 50%;
					margin-right: 20rpx;
				}

				&__name {
					font-family: PingFang SC;
					font-weight: 500;
					font-size: 30rpx;
					color: #323232;
					line-height: 30rpx;
					flex: 1;
				}

			}

			.active {
				background: #1E59F1;

			}

			&__tips {
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
				color: #93939B;
				line-height: 28rpx;
				margin-top: 40rpx;
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}

		&__kt {
			width: 51.79rpx;
			height: 52.38rpx;
			margin-right: 20rpx;
		}
	}

	.popbox1 {
		padding: 0 36rpx 73rpx 32rpx;
	}
</style>